@import "../base.scss";
body{
  color:$color--default;
  font-size:$fs__body--default;
}


.main{
  position:relative;
  background:$background__main--page;
}

//carousel
.carousel-block{
  width:100%;
  position:relative;
  overflow:hidden;
  .carousel{
    white-space: nowrap;
    width:100%;
    .carousel-li{
      font-size: 100px;
      display: inline-block;
      width: 100%;
      height: 440px;
      img {
        width: 100%;
        height: 440px;

      }
    }
  }
  .direction-btn{
      font-size:50px;
  }
  .previous-btn{
    position:absolute;
    left:20px;top:50%;
  }
  .next-btn {
    position:absolute;
    right:20px;top:50%;
  }
  .pagination-btn{
    position:absolute;
    left:50%;bottom:30px;
    li{
        float:left;margin-right:10px;
        border:1px solid #dfdfdf;height:20px;width:20px;border-radius:10px;text-align: center;line-height:20px;
        &:hover{
          background:red;color:#fff;
        }
    }
  }
}
//选中btn的颜色
.active-carousel{
  background:red;color:#fff;
}




.ad-banner{
  position:relative;
  margin-top:50px;
  img{
    width:100%;height:320px;max-height:320px;
  }
}

.main .btn-recommendation{
   width: 48px;
   height: auto;
   position: absolute;
   right: -62px;
   top: -6px;
}
.main.btn-recommendation-fixed{
  width: 48px;
  height: auto;
  position: fixed!important;
  right: -62px;
  top: -6px;
  transition:all 0.3s;
}
.main .btn-recommendation li{
margin-bottom:8px;
}
.main .btn-recommendation li{
  display:inline-block;
  padding:5px 10px;
  font-size:14px;
  background:rgba(227,227,227,1);
}
.main .btn-recommendation li:hover{
  background:#FF404E;
  color:#fff;
}

/*pickup */
.btn-recom-selected{
  background:#FF404E!important;
  color:#fff;
}


.main .banner{
  height:440px;
}

/*快速跳转按钮 str*/
.goods{
  position:relative;
}
.goods .btn-recommendation{
  width: 48px;
  height: auto;
  position: absolute;
  right: -62px;
  top: 42px;
}

.goods .btn-recommendation li{
  margin-bottom:8px;
}
.goods .btn-recommendation li a{
  display:inline-block;
  padding:5px 10px;
  font-size:14px;
  background:rgba(227,227,227,1);
}
.goods .btn-recommendation li a:hover{
  background:#FF404E;
  color:#fff;
}


/*快速跳转按钮 end*/


/*推荐商品 str*/
.goods-listing {

}

.goods-listing .titles{
  margin-top: 60px;
  margin-bottom: 20px;
}

.goods-listing .titles li{
  float: left;
  font-size: 30px;
  height:30px;
  line-height: 30px;
}

.goods-listing .titles .decoration-icon {
  width: 6px;
  height: 30px;
  background: #272727;
}

.goods-listing .titles .titletxt{
  margin-left: 20px;
  font-weight:700;
}
.goods-listing .titles .btn-links{
float:right;
}
.goods-listing .titles .btn-links a{
  margin-left:28px;
  font-size:14px;
}

.goods-listing .titles .btn-links a:hover{
  cursor:pointer;
  color:#FF404E;
  border-bottom:1px solid #FF404E;
  padding-bottom:5px;
}

/*风格分区 str*/
.goods-listing .style-partition{margin-bottom:40px;}
.goods-listing .style-partition li{
   float:left;
   margin-left:10px;
   width:287px;height:180px;
  text-align: center;
  color:#fff;
  border:2px solid transparent;
}
.goods-listing .style-partition li:hover{
  color:red;
  @include translate(translateY(-2px));
}
.goods-listing .style-partition li h3{
  font-size:40px;
  margin:50px 0 15px 0;
}

.goods-listing .style-partition li p{
  font-size:20px;
}
.goods-listing .style-partition li:nth-child(1){
  margin-left:0;
  background: url(../../img/mall/现代风格底色.png) no-repeat;
  box-shadow: 3px 2px 13px 3px #cdd2ed;
}
.goods-listing .style-partition li:nth-child(2){
  background: url(../../img/mall/中式风格.png) no-repeat;
  box-shadow: 3px 2px 13px 3px #eed5d8;
}
.goods-listing .style-partition li:nth-child(3){
  background: url(../../img/mall/欧美风格.png) no-repeat;
  box-shadow: 3px 2px 13px 3px #c6d6e7;
}
.goods-listing .style-partition li:nth-child(4){
  background: url(../../img/mall/田园风格.png) no-repeat;
  box-shadow: 3px 2px 13px 3px #edd4d1;
}

.style-partition-active{
  @include translate(translateY(2px));
  border:2px solid $border__color--active!important;
}

.classify-secondary{
  text-align:right;
  height:30px;
}
.classify-secondary a{
  margin-left:30px;
}
.classify-secondary a:hover{
  color:$color__hover--default;
}
.classify-secondary-active{
  color:$color__hover--default;
}
/*风格分区 end*/

.goods-listing .imgs{
}
.goods-listing .imgs .imgs-guidance{
  width:180px;
}
.goods-listing .imgs .imgs-guidance .guidance-pic-short{width:180px;height:220px;}
.goods-listing .imgs .imgs-guidance .guidance-pic-height{width:180px;height:550px;}

.goods-listing .imgs .imgs-guidance .moresurprise{
  width:180px;height:90px;margin-top:10px;
}

.goods-listing .imgs .imgs-guidance,.goods-listing .imgs .imgs-normal{
  float:left;
  //height:320px;
}

.goods-listing .imgs .imgs-normal{
  width:1000px;
}
.goods-listing .imgs .imgs-normal li{
  position:relative;
  float:left;
  width:240px;height:320px;
  margin-left:10px;
  text-align:center;
  background: #fff;
  margin-bottom:10px;
}
.goods-listing .imgs .imgs-normal li:hover{
  position:relative;
  float:left;
  width:240px;height:320px;
  margin-left:10px;
  text-align:center;
  background: #fff;
  box-shadow: 2px 2px 2px 2px #dfdfdf;
  transition:all 0.4s;
  cursor:pointer;
  @include translate(translateY(-2px));
}

.goods-listing .imgs .imgs-normal li .btn-save{
   position:absolute;
   top:7px;left:7px;
   background: rgba(0,0,0,0.3);
   border: 0;
   outline: none;
   width: 60px;
   height: 32px;
   color: #fff;
   font-size:16px;
}
.goods-listing .imgs .imgs-normal li .btn-save:hover{
  cursor:pointer;
}

.goods-listing .imgs .imgs-normal li img{
  display:inline;
  margin-top:14px;
}

.goods-listing .imgs .imgs-normal li .img-title{
  font-size:18px;
  margin:15px 0;
}

.goods-listing .imgs .imgs-normal li .price{

}
.goods-listing .imgs .imgs-normal li .price .now-price{
  color:#FF404E;
}
.goods-listing .imgs .imgs-normal li .price .orig-price{
  color:#CACACA;
  margin-left:10px;
}

.goods .img-advertising{
  margin-top:60px;
  width:1180px;
  max-width:1180px;
  height:200px;
  max-height:200px;
}

/*推荐商品 end*/

//.ttt{
//background:url(../../img/common-icons.png) no-repeat  10px center;
//}


